<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
 <%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<%@ include file="/WEB-INF/views/include/easyui.jsp"%>
<title>查看邮件</title>
<style>
.formTable {
	width: 100%;
	background-color: #F0F0F0;
	font-size: 12px;
	margin-left:5px;
}

.formTable tr{
	line-height:16px;
}
.formTable td{
	color:#6C6C6C;
}

.formTable a {
	font-size: 12px;
}
.title{
	width:40px;
}
</style>
</head>
<body>
	<table class="formTable">
	<input type="hidden" id="MAIL_ID" value="${bean.mailId}"/> 
	<input type="hidden" id="BACK_URL" value="${back }" />
	<c:if test="${IS_INBOX==0 }">
		<!-- 发件人操作按钮 -->
		<tr style="background-color:#ffffff;">
			<td colspan="2">
			
				<a class="easyui-linkbutton" plain="true"
				iconCls="icon-hamburg-sign-out" onclick="back()">返回</a>&nbsp;<span
				class="toolbar-item dialog-tool-separator"></span>
				<a class="easyui-linkbutton" plain="true"
				iconCls="icon-standard-arrow-refresh" onclick="redo(${bean.id})">再次编辑</a>&nbsp;<span
				class="toolbar-item dialog-tool-separator"></span>
				<a class="easyui-linkbutton" plain="true"
				iconCls="icon-standard-arrow-undo" onclick="reCall(${bean.id})">撤回</a>&nbsp;<span
				class="toolbar-item dialog-tool-separator"></span>
				<a class="easyui-linkbutton" plain="true"
				iconCls="icon-standard-arrow-turn-right" onclick="forward(${bean.id})">转发</a>&nbsp;<span
				class="toolbar-item dialog-tool-separator"></span>
				<a class="easyui-linkbutton" plain="true"
				iconCls="icon-hamburg-busy" onclick="del(${bean.id})">删除</a>&nbsp;<span
				class="toolbar-item dialog-tool-separator"></span>
				<a href="#"
				class="easyui-menubutton" plain="true" id="markBtn"
				data-options="menu:'#mark',iconCls:'icon-hamburg-star'">标记为...</a>
			<div id="mark" style="width: 150px;">
				<div data-options="iconCls:'icon-hamburg-star'" onclick="addStar()">星标邮件</div>
				<div data-options="iconCls:'icon-metro-star'" onclick="unStar()">取消星标</div>
				<div class="menu-sep"></div>
				<div data-options="iconCls:'icon-standard-tag-blue-edit'">
					自定义标签
					<div style="width: 150px;">
						<c:forEach var="tag" items="${TAGS }">
							<div data-options="iconCls:'${tag.markStyle }'"
								onclick="addTag(${tag.id})">${tag.markName }</div>
						</c:forEach>
					</div>
				</div>

				
			</div>
			<span class="toolbar-item dialog-tool-separator"></span> <a href="#"
				class="easyui-menubutton" plain="true"
				data-options="menu:'#move',iconCls:'icon-standard-book-previous'"
				onclick="">移动到...</a>
			<div id="move" style="width: 150px;">
				<div data-options="iconCls:'icon-hamburg-folder'" onclick="moveForder(1)">收件箱</div>
				<div data-options="iconCls:'icon-hamburg-folder'" onclick="moveForder(2)">发件箱</div>
				<div class="menu-sep"></div>
				<div data-options="iconCls:'icon-standard-folder'">
					自定义文件夹
					<div style="width: 150px;">
						<c:forEach var="forder" items="${FORDERS }">
							<div data-options="iconCls:'icon-standard-folder-go'"
								onclick="moveForder(${forder.id})">${forder.forderName }</div>
						</c:forEach>
					</div>
				</div>

				
			
			</div>
			</td>
		</tr>
		</c:if>
		<c:if test="${IS_INBOX==1 }">
		<!-- 收件人操作按钮 -->
		<tr style="background-color:#ffffff;">
			<td colspan="2">
				<a class="easyui-linkbutton" plain="true"
				iconCls="icon-hamburg-sign-out" onclick="back()">返回</a>&nbsp;<span
				class="toolbar-item dialog-tool-separator"></span>
				<a class="easyui-linkbutton" plain="true"
				iconCls="icon-standard-arrow-refresh" onclick="redo(${bean.id})">回复</a>&nbsp;<span
				class="toolbar-item dialog-tool-separator"></span>
				<a class="easyui-linkbutton" plain="true"
				iconCls="icon-standard-arrow-undo" onclick="redoAll(${bean.id})">回复全部</a>&nbsp;<span
				class="toolbar-item dialog-tool-separator"></span>
				<a class="easyui-linkbutton" plain="true"
				iconCls="icon-standard-arrow-turn-right" onclick="forward(${bean.id})">转发</a>&nbsp;<span
				class="toolbar-item dialog-tool-separator"></span>
				<a class="easyui-linkbutton" plain="true"
				iconCls="icon-hamburg-busy" onclick="del(${bean.id})">删除</a>&nbsp;<span
				class="toolbar-item dialog-tool-separator"></span>
				<a href="#"
				class="easyui-menubutton" plain="true" id="markBtn"
				data-options="menu:'#mark',iconCls:'icon-hamburg-star'">标记为...</a>
			<div id="mark" style="width: 150px;">
				<div data-options="iconCls:'icon-hamburg-star'" onclick="addStar()">星标邮件</div>
				<div data-options="iconCls:'icon-metro-star'" onclick="unStar()">取消星标</div>
				<div class="menu-sep"></div>
				<div data-options="iconCls:'icon-standard-tag-blue-edit'">
					自定义标签
					<div style="width: 150px;">
						<c:forEach var="tag" items="${TAGS }">
							<div data-options="iconCls:'${tag.markStyle }'"
								onclick="addTag(${tag.id})">${tag.markName }</div>
						</c:forEach>
					</div>
				</div>

				
			</div>
			<span class="toolbar-item dialog-tool-separator"></span> <a href="#"
				class="easyui-menubutton" plain="true"
				data-options="menu:'#move',iconCls:'icon-standard-book-previous'"
				onclick="">移动到...</a>
			<div id="move" style="width: 150px;">
				<div data-options="iconCls:'icon-hamburg-folder'" onclick="moveForder(1)">收件箱</div>
				<div data-options="iconCls:'icon-hamburg-folder'" onclick="moveForder(2)">发件箱</div>
				<div class="menu-sep"></div>
				<div data-options="iconCls:'icon-standard-folder'">
					自定义文件夹
					<div style="width: 150px;">
						<c:forEach var="forder" items="${FORDERS }">
							<div data-options="iconCls:'icon-standard-folder-go'"
								onclick="moveForder(${forder.id})">${forder.forderName }</div>
						</c:forEach>
					</div>
				</div>

				
			</div>
			</td>
		</tr>
		</c:if>
		<tr><td colspan="2"><span style="font-size:16px;font-weight:bolder;color:#000000;font-family:黑体;">${bean.mailTitle }</span>
			<!-- 创建标签 -->
			<c:forEach var="mk"   items="${bean.markers }">
				<span class='l-btn-left l-btn-icon-left' id="mark_${mk.markId }" onclick='delMark(${mk.markId})'><span class='l-btn-text'>${mk.markName}</span><span class='l-btn-icon ${mk.markStyle}'>&nbsp;</span></span>
			</c:forEach>
			<!-- 创建星星 -->
			<c:if test="${bean.isStart==1 }">
				<span class='l-btn-left l-btn-icon-left' onclick='unStar(${bean.mailId})'><span class='l-btn-text'>&nbsp;</span><span class='l-btn-icon icon-hamburg-star'>&nbsp;</span></span>
			</c:if>
			<c:if test="${bean.isStart==0 }">
				<span class="l-btn-left l-btn-icon-left" onclick='addStar(${bean.mailId})'><span class='l-btn-text'>&nbsp;</span><span class='l-btn-icon icon-metro-star'>&nbsp;</span></span>
			</c:if>
			<!--  -->
		</td></tr>
		<tr>
			<td class="title">发件人:</td>
			<td align="left">${bean.createUserName }</td>
		</tr>
		<tr>
			<td>时&nbsp;&nbsp;&nbsp;间:</td>
			<td align="left">${bean.dateTime }</td>
		</tr>
		<tr>
			<td>收件人:</td>
			<td align="left">${bean.consigneeVal }</td>
		</tr>
		<c:if test="${not empty bean.ccVal}">
		<tr>
			<td>抄&nbsp;&nbsp;&nbsp;送:</td>
			<td align="left">${bean.ccVal }</td>
		</tr>
		</c:if>
		
		<c:if test="${not empty bean.annexVal}">
		<tr>
			<td>附&nbsp;&nbsp;&nbsp;件:</td>
			<td>${bean.annexCount }个( <a href="#"
				class="easyui-linkbutton" plain="true" iconCls="${bean.annexs[0].annexStyle }">${bean.annexs[0].annexName}<c:if test="${bean.annexCount>1}">...</c:if></a>)</td>
		</tr>
		</c:if>
	</table>
	
	<div style="width:100%;margin-left:5px;font-size:13px;">
		${bean.mailContent}
	</div>
	<c:if test="${not empty bean.annexVal}">
	<div style="width:100%;background-color: #F0F0F0;font-size:14px;height:30px;line-height:30px;margin-left:5px;">
		<span class="icon-cologne-cv">&nbsp;&nbsp;&nbsp;&nbsp;</span>附件列表
	</div>
	<div style="width:100%;border:3px solid #F0F0F0;font-size:12px;margin-left:5px;">
		<table>
		 <c:forEach var="annex"   items="${bean.annexs }">
			<tr><td>
			<a href="#"
				class="easyui-linkbutton" plain="true" iconCls="${annex.annexStyle }">
			 <c:if test="${fn:length(annex.annexName)>'13'}">  
                    ${fn:substring(annex.annexName,0,13)}...  
            </c:if>  
            <c:if test="${fn:length(annex.annexName)<='13'}">  
                ${annex.annexName}  
            </c:if>  
            大小:(${annex.annexSize })</a>
			
			</td><td><c:if test="${annex.allowPre==1 }"><a href="javascript:perDoc('${annex.annexPath}')">预览</a>|</c:if><a href="<%=path%>/${annex.annexPath}" download="${annex.annexName}">下载</a></td></tr>
		</c:forEach>
		</table>
	</div>
	</c:if>
	<div id="dlg"></div>
	
</body>
<c:if test="${IS_INBOX==0 }">
<script type="text/javascript">
var d;
	function back(){
		var backUrl=$("#BACK_URL").val();
		console.log(backUrl);
		if(backUrl){
			window.location.href="<%=path%>/"+backUrl;
		}else{
			window.location.href="<%=path%>/mail/sent";
		}
		
	}
	function redo(id){
		window.location.href="<%=path%>/mail/redo?mailId="+id;
	}
	function forward(id){
		window.location.href="<%=path%>/mail/redo?mailId="+id+"&forward=forward";
	}
	function del(id){
		parent.$.messager.confirm('提示', '您确定要删除该邮件？', function(data){
			if(data){
				window.location.href="<%=path%>/mail/del?mailId="+id;
			}
		});
	}
	
	function reCall(id){
		parent.$.messager.confirm('提示', '确定撤回此邮件吗？<br/>如果撤回成功，对方将只能看到邮件的主题，并得到已被撤回的提示。', function(data){
			if(data){
				$.ajax({
					type:'get',
					url:"<%=path%>/mail/reCall?mailId="+id,
					success: function(data){
						if(data=="timeout"){
							parent.$.messager.show({ title : "提示",msg: "撤回失败！已超过3小时", position: "bottomRight" });
						}else if(data=="success"){
							parent.$.messager.show({ title : "提示",msg: "撤回成功！", position: "bottomRight" });
						}else{
							parent.$.messager.show({ title : "提示",msg: "撤回失败，系统错误", position: "bottomRight" });
						}
						
					}
				});
				
			}
		});
	}
</script>
</c:if>
<!-- 收件箱点击 -->
<c:if test="${IS_INBOX==1 }">
<script type="text/javascript">
var d;
	function back(){
		var backUrl=$("#BACK_URL").val();
		if(backUrl){
			window.location.href="<%=path%>/"+backUrl;
		}else{
		window.location.href="<%=path%>/mail/inBox";
		}
	}
	function redo(id){
		window.location.href="<%=path%>/mail/reply?mailId="+id;
	}
	function redoAll(id){
		window.location.href="<%=path%>/mail/reply?mailId="+id+"&type=ALL";
	}
	function forward(id){
		window.location.href="<%=path%>/mail/redo?mailId="+id+"&forward=forward";
	}
	function del(id){
		parent.$.messager.confirm('提示', '您确定要删除该邮件？', function(data){
			if(data){
				window.location.href="<%=path%>/mail/delInbox?mailId="+id;
			}
		});
	}
</script>
</c:if>
<script>
function perDoc(path){
	//添加图片到textarel
	d=$('#dlg').dialog({    
	    title: '预览',    
	    width: 1000,    
	    height: 400,    
	    closed: false,    
	    cache: false,
	    maximizable:true,
	    maximized:true,
	    resizable:true,
	    buttons:"<div><center>leeko 提供转码</center></div>",
	    href:'<%=path%>/mail/toPer?path='+path,
		modal : true
});

}


function addStar(){
	var ids=getIds();
	if(ids!=""){
		$.ajax({
			type:'get',
			url:"<%=path%>/mail/addStar?ids="+ids,
			success: function(data){
				if(data.indexOf("success")!=-1){
					//页面刷新
					history.go(0)
				}
			}
		});
	}
	
}
function unStar(){
	//去掉星标
	var ids=getIds();
	if(ids!=""){
		$.ajax({
			type:'get',
			url:"<%=path%>/mail/unStar?ids="+ids,
			success: function(data){
				if(data.indexOf("success")!=-1){
					//页面刷新
					history.go(0)
				}
			}
		});
	}
}

function delMark(val){
	parent.$.messager.confirm('提示', '该操作将删除该标签？', function(data){
		if(data){
			$.ajax({
				type:'get',
				cache:false,
				url:"<%=path%>/mail/delMark?id="+val,
				success: function(data){
					if(data.indexOf("success")!=-1){
						$("#mark_"+val).remove();
					}
			    		
				}
			});
		}
	});
}
function addTag(tagId){
	var ids=getIds();
	if(ids!=""){
		$.ajax({
			type:'get',
			url:"<%=path%>/mail/doTag?id="+tagId+"&markMails="+ids,
			success: function(data){
				if(data.indexOf("success")!=-1){
					//页面刷新
					history.go(0)
				}
		    		
			}
		});
	}
}

function moveForder(forderId){
	var ids=getIds();
	if(ids!=""){
		$.ajax({
			type:'get',
			url:"<%=path%>/mail/doForder?id="+forderId+"&ids="+ids,
			success: function(data){
				if(data.indexOf("success")!=-1){
					//提示移动成功
					parent.$.messager.show({ title : "提示",msg: "移动成功！", position: "bottomRight" });
				}
			}
		});
	}
}
function getIds(){
	return $("#MAIL_ID").val();
}

</script>
</html>